<template>
    <div>
        <div>
            <h1>学生系统</h1>
        </div>
        <div>
            <h2>欢迎登录</h2>
            <el-form :model="form">
                <el-form-item label="">
                    <el-input v-model="form.username"></el-input>
                    <el-input v-model="form.password"></el-input>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="submitForm">登录</el-button>
                    <el-button>重置</el-button>
                </el-form-item>
            </el-form>
        </div>
    </div>
</template>
  
<script setup>
import { useRouter } from 'vue-router'
import { ref, reactive, toRefs, onBeforeMount, onMounted } from 'vue'
import { login } from '../utils/API.js'
const router = useRouter()
const form = reactive({
    username: '',
    password: '',
})
const submitForm = async () => {
    try {
        const res = await login(form)
        console.log(res);
        localStorage.setItem('token', res.data.token)
        router.push('/index')
    } catch (error) {
        console.log(error);
    }
}
</script>
<style scoped>

</style>